<template>
  <div id="jobUserInfo">
    <div class="img-list-box">
      <!--有item.video的时候，展示视频，无时，展示图片-->
      <videoFace
        v-if="item.jobType === 'VIDEO'"
        :img-src="item.img"
        :vid="item.video"
      ></videoFace>
      <showImg v-else :img-list="strToAry(item.img)"></showImg>
    </div>
    <div class="info-right">
      <div class="right-top">
        <dl class="info-header">
          <dt>
            <el-image :src="item.avatar" fit="fill"></el-image>
          </dt>
          <dd>
            <span class="nike-name">
              {{ item.nickname }}
            </span>
            <!--学院-->
            <el-tag v-if="item.categoryId" type="success" effect="dark">
              {{ item.categoryId | filterName('collegeType') }}
            </el-tag>
            <!--是否推荐-->
            <el-tag
              v-if="item.isRecommend && item.isRecommend === 'Y'"
              type="success"
              effect="dark"
            >
              {{ item.recommendType | filterName('recommendType') }}
            </el-tag>
            <!--打分-->
            <el-tag
              v-if="item.approvedLevel !== null"
              type="success"
              effect="dark"
            >
              {{ item.approvedLevel | filterName('jobLevel') }}
            </el-tag>
            <!--课程等级-->
            <el-tag v-if="item.courseLevel" type="success" effect="dark">
              {{ item.courseLevel === 'OTHER' ? '其他' : item.courseLevel }}
            </el-tag>
            <!--是否试学-->
            <el-tag
              v-if="item.courseType && item.courseType === 'TEST'"
              type="success"
              effect="dark"
            >
              试
            </el-tag>
            <!--此处插槽，用来添加其他tag标签-->
            <slot name="infoTag"></slot>
            <!--是否用户-->
            <el-tag type="success" effect="dark">
              {{ item.whOperator ? '马甲' : '用户' }}
            </el-tag>
            <span class="nike-name">讲师：{{ item.teacherName }}</span>
            <el-popover
              v-if="showUp"
              v-model="visible"
              placement="bottom"
              width="180"
              trigger="manual"
            >
              <p class="pop-con" v-html="upCon"></p>
              <el-button slot="reference" @click="addPraiseSpeed('1')">
                加赞进度
              </el-button>
            </el-popover>
            <el-popover
              v-if="showUpTimeIng"
              v-model="visibleTimeIng"
              placement="bottom"
              width="180"
              trigger="manual"
            >
              <p class="pop-con" v-html="upContentIng"></p>
              <el-button slot="reference" @click="addPraiseSpeed('2')">
                限时批量加赞中
              </el-button>
            </el-popover>
            <el-popover
              v-if="showUpTime"
              v-model="visibleTime"
              placement="bottom"
              width="250"
              trigger="manual"
            >
              <p class="pop-con" v-html="upContent"></p>
              <el-button slot="reference" @click="addPraiseSpeed('3')">
                限时批量加赞
              </el-button>
            </el-popover>
          </dd>
          <dd>
            <span class="nick-code">{{ item.dpAccount }}</span>
            <span class="nick-code">创建时间：{{ item.jobSubmitTime }}</span>
            <!-- <span v-if="item.jobLastModificationTime" class="nick-code"
              >批改时间：{{ item.jobLastModificationTime }}</span
            >-->
          </dd>
        </dl>
        <div class="info-content">
          <span v-html="filterContent(item.jobContent)"></span>
        </div>
        <dl class="info-con">
          <!-- v-if=" powerAry.includes( `system:${from === 'jobMin' ? 'homeRelease'
          : 'home'}:detail` ) " -->
          <dd
            v-permission="
              `wh:system:${from === 'jobMin' ? 'homeRelease' : 'home'}:detail`
            "
          >
            <i class="el-icon-link"></i>
            <a href="javascript:;" @click="showDetail">{{ item.taskTitle }}</a>
          </dd>
          <dd>作业码：{{ item.identificationCode }}</dd>
          <dd v-if="item.jobType === 'VIDEO'" class="info-video">
            VID:{{ item.video }}
          </dd>
        </dl>
      </div>
      <ul class="foot-list">
        <!-- v-if=" powerAry.includes( `system:${from === 'jobMin' ? 'homeRelease' :
        'home'}:comment` ) " -->
        <li
          v-permission="
            `wh:system:${from === 'jobMin' ? 'homeRelease' : 'home'}:comment`
          "
          class="pointer"
          @click="
            changeView(
              from === 'jobMin'
                ? 'wh:system:jobRelease:commentList'
                : 'wh:system:jobMaintain:commentList'
            )
          "
        >
          评论 {{ item.commentNum }}
        </li>
        <!-- v-if=" powerAry.includes( `system:${from === 'jobMin' ? 'homeRelease' :
        'home'}:praise` ) " -->
        <li
          v-permission="
            `wh:system:${from === 'jobMin' ? 'homeRelease' : 'home'}:praise`
          "
          class="pointer"
          @click="
            changeView(
              from === 'jobMin'
                ? 'wh:system:job:likeList'
                : 'wh:system:workmanage:likeList'
            )
          "
        >
          点赞 {{ item.praiseNumber }}
        </li>
        <!-- v-if=" powerAry.includes( `system:${from === 'jobMin' ? 'homeRelease' :
        'home'}:share` ) " -->
        <li
          v-permission="
            `wh:system:${from === 'jobMin' ? 'homeRelease' : 'home'}:share`
          "
          class="pointer"
          @click="showDialogNum('share')"
        >
          虚拟分享量 {{ item.virtualShareAmount }}
        </li>
        <li>真实分享量 {{ item.shareAmount }}</li>
        <!-- v-if=" powerAry.includes( `system:${from === 'jobMin' ? 'homeRelease' :
        'home'}:virtualPlay` ) " -->
        <template
          v-permission="
            `wh:system:${
              from === 'jobMin' ? 'homeRelease' : 'home'
            }:virtualPlay`
          "
        >
          <li v-if="item.video" class="pointer" @click="showDialogNum('video')">
            虚拟播放量 {{ item.virtualPlayAmount }}
          </li>
        </template>
        <li v-if="item.video">真实播放量 {{ item.playAmount }}</li>
        <li class="canClick" @click="getEditor">最新编辑者 {{ editor }}</li>
        <li
          v-if="item.delStatu === 'N' && item.video"
          class="canClick"
          @click="getAuditStatus"
        >
          审核状态 {{ auditStatus }}
        </li>
        <li v-if="item.delStatu === 'Y'">删除理由： {{ showRes }}</li>
      </ul>
      <!--隐性标签-->
      <hideLabel
        v-permission="
          `wh:system:${from === 'jobMin' ? 'homeRelease' : 'home'}:label`
        "
        :hideLabelObj="hideLabelObj"
        :user="item.user"
        :labels="item.labels"
        :labelList="labelList"
        :labelListTotal="labelListTotal"
        v-if="showHideLabel"
      ></hideLabel>
    </div>
    <jobDetail v-if="dialogData.isShow" :dialog-data="dialogData"></jobDetail>
    <dialogNum
      v-if="dialogNumData.isShow"
      :dialog-data="dialogNumData"
      @changeNum="changeNum"
      @changePlayNum="changePlayNum"
    ></dialogNum>
  </div>
</template>

<script>
import { editor, changeShare, changePlay } from '@/api/jobManagement' // 接口
import { contentToStr } from '@utils/pubFunction'
import showImg from '@common/showImg'
import videoFace from '@common/videoFace'
import jobDetail from '@component/jobManagement/common/dialogDetail' // 作业要求详细弹窗
import dialogNum from '@common/dialogNum' // 虚拟分享量/虚拟播放量-弹窗
import hideLabel from '@common/hideLabel/index' // 隐性标签
import {
  sysNormalDisable,
  getStatusCode,
  getDelCode
} from '@utils/dictionariesFunc'
import { praiseSpeed } from '@/api/common/likesAPI'
export default {
  name: 'jobUserInfo',
  msg: '作业管理-作业维护/我的发布-用户主要信息',
  components: {
    showImg,
    jobDetail,
    dialogNum,
    videoFace,
    hideLabel
  },
  props: ['item', 'index', 'from', 'powerAry', 'labelList', 'labelListTotal'], // from-"jobMin"(我的发布)/"jobPre"(作业维护)
  data() {
    return {
      categoryType: 4, // 1.社团 2.活动 3.作品 4.作业 5.回放视频 8.生活
      editor: '', // 最新编辑者
      auditStatus: '', // 审核状态
      showRes: '', //删除原因
      id: '', // item.jobcompletionId
      dialogData: {
        isShow: false, // 默认隐藏
        params: '', // 编辑时，传递的参数
        stageId: '' // 期id
      },
      dialogNumData: {
        // 虚拟分享量/虚拟播放量
        isShow: false, // 默认隐藏
        type: '',
        num: 0,
        params: '' // 编辑时，传递的参数
      },
      upCon: '', // 加赞进度
      upContentIng: '', // 限时批量加赞中
      upContent: '', // 限时批量加赞
      visible: false, // 激活显示内容-加赞进度
      visibleTimeIng: false, // 激活显示内容-限时批量加赞中
      visibleTime: false, // 激活显示内容-限时批量加赞
      showUp: false, // 是否显示加赞进度
      showUpTimeIng: false, // 是否显示限时批量加赞中
      showUpTime: false, // 是否显示限时批量加赞
      showHideLabel: false, //是否显示隐性标签
      hideLabelObj: {} //是否显示隐性标签
    }
  },
  computed: {
    listenshowUp() {
      return this.$store.state.praiseSpeed[`job_${this.from}_up_${this.index}`]
    },
    listenshowUpTime() {
      return this.$store.state.praiseSpeed[
        `job_${this.from}_UpTime_${this.index}`
      ]
    }
  },
  watch: {
    listenshowUp(newV, oldV) {
      if (newV) {
        this.showUp = true
      } else {
        this.showUp = false
      }
    },
    listenshowUpTime(newV, oldV) {
      if (newV) {
        this.showUpTime = true
      } else {
        this.showUpTime = false
      }
    }
  },
  mounted() {
    this.setShowUpBtn()
    this.id = this.item.jobcompletionId
    if (this.item.delStatu === 'Y') {
      this.getReason(this.item.reason, this.item.video)
    }
    this.getLabelShowStatu()
  },
  methods: {
    /* 过滤返回内容 */
    filterContent(item) {
      return contentToStr(item)
    },
    /*隐性标签是否显示*/
    getLabelShowStatu() {
      let isShow = this.$parent.$parent.showComment(this.item)
      // let power = this.powerAry.includes(
      //   `system:${this.from === 'jobMin' ? 'homeRelease' : 'home'}:label`
      // )
      this.showHideLabel = isShow
      // this.showHideLabel = isShow && power
      if (this.showHideLabel) {
        //整合obj
        let {
          checkStatu: auditStatu,
          categoryId: collegeId,
          jobContent: content,
          jobcompletionId: contentId,
          jobSubmitTime: createDate,
          img: images,
          jobType: type,
          whOperator: operatorId,
          userId,
          video: videoId
        } = this.item

        this.hideLabelObj = {
          activityId: '', //活动id
          auditStatu, //人审状态 PASS通过 / UNCHECKED未审核
          collegeId, //学院id
          content, //内容
          contentId, //内容id
          createDate, //创建时间
          displayRule: '', //展示规则 ALL公开展示 / PERSONAL仅主页可见
          images, //图片
          type, //内容类型：图文/视频,可用值:TEXT,VIDEO
          operatorId, //运营人id
          userProperty: operatorId ? 'VEST' : 'REALUSER', //马甲、用户，可用值:REALUSER,VEST
          userId, //发帖人id
          videoId, //保利威视vid
          channel: 'JOB' //频道,可用值:JOB,LIFE,WORK,GROW,ACTIVITY,ARTICLE,SHORT_VIDEO,LONG_VIDEO
        }
        /* console.log(this.hideLabelObj)*/
      }
    },
    /* 判断加赞按钮显示隐藏 */
    setShowUpBtn() {
      if (this.item.robotPraise != null) {
        // 普通点赞状态
        if (this.item.robotPraise.taskList != null) {
          if (this.item.robotPraise.taskList.length > 0) {
            // 加赞进度
            this.showUp = true // 加赞进度
          }
        }
        if (
          this.item.robotPraise.executionTask != null ||
          this.item.robotPraise.unExecutionTask != null
        ) {
          if (this.item.robotPraise.executionTask.length > 0) {
            // 限时批量加赞中
            this.showUpTimeIng = true // 限时批量加赞中
          } else if (this.item.robotPraise.unExecutionTask.length > 0) {
            // 限时批量加赞
            this.showUpTime = true // 限时批量加赞
          }
        }
      }
    },
    /* 显示加赞进度 */
    async addPraiseSpeed(type) {
      let obj = {
        topicId: this.id,
        topicCreatedBy: this.item.userId,
        categoryType: this.categoryType
      }
      let data = await praiseSpeed(obj)
      switch (type) {
        case '1': // 加赞进度
          this.showUpCon(data.taskList, 'visible', 'upCon', '')
          break
        case '2': // 限时批量加赞中
          this.showUpCon(
            data.executionTask,
            'visibleTimeIng',
            'upContentIng',
            ''
          )
          break
        case '3': // 限时批量加赞
          this.showUpCon(
            data.unExecutionTask,
            'visibleTime',
            'upContent',
            'addDate'
          )
          break
      }
    },
    /* 设置当前显示点赞内容 */
    showUpCon(targetDate, targetVisible, targetCon, type = '') {
      let _this = this
      _this[targetCon] = ''
      this[targetVisible] = true
      let curData = targetDate
      if (curData.length > 0) {
        curData.forEach((item, index) => {
          if (index > 0) {
            _this[targetCon] += `<br/>`
          }
          _this[
            targetCon
          ] += `${item.number}/${item.total}  ${item.operateUser.nickName}`
          if (type) {
            _this[targetCon] += `--- ${item.startDate}`
          }
        })
      } else {
        _this[targetCon] = '暂无加赞进度'
      }
      setTimeout(() => {
        this[targetVisible] = false
      }, 2000)
    },
    /* 获取最新编辑者 */
    getEditor() {
      editor(this.id, (response) => {
        let e = response || ' -'
        this.editor = ':' + e
      })
    },
    /* 获取审核状态 */
    async getAuditStatus() {
      let obj = {
        topicId: this.id,
        topicType: 'JOB', //作品（ WORK ）、作业（ JOB ）、生活( LIFE )
        userId: this.item.userId,
        delStatu: this.item.delStatu,
        polyvStatu: this.item.polyvStatu
      }
      let code = await getStatusCode(this.item.video, obj)
      code = code.toString()
      let ary = await sysNormalDisable('poly_status')
      let cur = ary.find((item) => item.dictValue === code)
      this.auditStatus = ': ' + cur.dictLabel
    },
    /* 字符串转为数组 */
    strToAry(str) {
      return str.split(',')
    },
    /* 显示详情弹窗 */
    showDetail(id) {
      this.dialogData.isShow = true
      this.dialogData.params = this.item.taskId
      this.dialogData.stageId = this.item.courseChannelId
    },
    /* 显示-虚拟分享量/虚拟播放量-弹窗 */
    showDialogNum(type) {
      if (this.item.delStatu === 'Y') return
      this.dialogNumData.type = type
      this.dialogNumData.isShow = true
    },
    /* 跳转页面 */
    changeView(name) {
      let id = this.item.jobcompletionId
      let from = this.from
      let query = {
        from,
        id: id
      }
      this.$router.push({ name, query })
    },
    /*关闭虚拟分享量/播放量弹窗*/
    closeDialog() {
      this.dialogNumData.isShow = false
      this.dialogNumData.type = ''
    },
    /* 修改虚拟分享量 */
    changeNum(n) {
      let obj = {
        amount: n
      }
      changeShare(
        this.id,
        obj,
        (response) => {
          this.$message.success('操作成功')
          this.closeDialog()
          this.item.virtualShareAmount = n
          /* this.$emit('refresh')*/
        },
        (response) => {
          this.$message.warning(response.message)
        }
      )
    },
    /* 修改虚拟播放量 */
    changePlayNum(n) {
      let obj = {
        amount: n
      }
      changePlay(
        this.id,
        obj,
        (response) => {
          this.$message.success('操作成功')
          this.closeDialog()
          this.item.virtualPlayAmount = n
          /*this.$emit('refresh')*/
        },
        (response) => {
          this.$message.warning(response.message)
        }
      )
    },
    /*获取删除理由*/
    async getReason(res, vid) {
      let polivRes = '保利威视审核不通过'
      if (res === polivRes) {
        let cur = await getDelCode(vid)
        this.showRes = cur ? cur : polivRes
      } else {
        this.showRes = res
      }
    }
  }
}
</script>

<style lang="less">
#jobUserInfo {
  display: flex;
  justify-content: left;
  @import url('~@common/style/userInfo.less');
  dl.info-con {
    dd {
      padding-bottom: 8px !important;
    }
  }
}
</style>
